<?php 
$pageTitle = "Author Page";
include_once "common/header.php"; 
?>
<link href='http://fonts.googleapis.com/css?family=Alegreya+Sans' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Alegreya+Sans:700,900' rel='stylesheet' type='text/css'>
<link href="css/uploadblocks/uploadblocks.css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="css/user/myblocks.css" />
<link rel="stylesheet" type="text/css" href="css/user/author-page.css" />







<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript" src="scripts/blocksreader/jquery.easing.1.3.js"></script>



	<script type="text/javascript" src="scripts/myblocks/jquery.wallform.js"></script>
	<script src="scripts/uploadblocks/jquery.knob.js"></script>

		<!-- jQuery File Upload Dependencies -->
		<script src="scripts/uploadblocks/jquery.ui.widget.js"></script>
		<script src="scripts/uploadblocks/jquery.iframe-transport.js"></script>
		<script src="scripts/uploadblocks/jquery.fileupload.js"></script>
		
		<!-- Our main JS file -->
		<script src="scripts/uploadblocks/uploadblocks.js"></script>
		<script type="text/javascript" src="scripts/myblocks/myblocks.js"></script>
		<script type="text/javascript" src="scripts/myblocks/authorpage.js"></script>
		

	

<body>
	<div class ="widget-container">
		<div id = "manage-content">
			<h2> Manage </h2>
			
			<div id="manage-main">
			<aside>
			<a id ="edit-pages">Add/Delete Pages</a>
			</aside>
			<form>
				<div class="m-wrapper">
				<label>Title:</label>
					
				<input id="title" type="text" placeholder=""  name = "Title" />
				<label id="title_val"></label>
				<a id="edit_title">Edit</a>
				</div>
				<div class="m-wrapper">
				<label>Synopsis:</label>
				<br />
				<p id="m_synopsis-val"></p>
				<textarea id="m_synopsis" name="synopsis" placeholder="Summary of your block..." ></textarea>  
				<a id="edit_synopsis">Edit</a>
				</div>
				<div class="m-wrapper">
				<div class="category">
					 <label>Gategory:</label>
					 <br />
					 <input type = "checkbox"
						 id = "category"
						 value = "Action & Adventure" />
					 <label for = "Action & Adventure">Action & Adventure</label>
					 <input type = "checkbox"
						 id = "category"
						 value = "Manga" />
					 <label for = "Manga">Manga</label>
					 <input type = "checkbox"
						 id = "category"
						 value = "Comedy" />
					 <label for = "Comedy">Comedy</label>
					 <input type = "checkbox"
						 id = "category"
						 value = "Drama" />
					 <label for = "Drama">Drama</label>
					 <input type = "checkbox"
						 id = "category"
						 value = "Romance" />
					 <label for = "Romance">Romance</label>
					 <input type = "checkbox"
						 id = "category"
						 value = "Horror & Thriller" />
					 <label for = "Horror & Thriller">Horror & Thriller</label>
				</div>
				</div>
			</form>
			<a class ="button">Save</a>
			</div>
			<div id="manage-pages">
				
		</div> <!--END MANAGE-->
		</div>
	</div> <!--END WIDGET CONTAINER--->

	<div class="uploadblocks-content">
			
			<h2>add new block +  </h2>
			<h3>Step 1: Block Details</h3>
			<div class="seperator"></div>
				<div id ="progress_bar">
				<ul>
					<li>1</li>
					<li>2</li>
					<li>3</li>
				</ul>
				 <div id="progress"></div>
				
			</div>
				<div id="first_step"> <!-- FIRST STEP --->

				<form action="" enctype="multipart/form-data">
				<input class="textfield" type="text" placeholder="Title" required="" name = "Title">
				<br/>
				<label for="synopsis">Synopsis</label>
				<br />
				<textarea class="synopsis" name="synopsis" placeholder="Summary of your block..." required="required" data-minlength="20"></textarea>  
				<br />
				<label>Category:</label>
				<div class="category">
					 <input type = "checkbox"
						 id = "category"
						 value = "Action & Adventure" />
					 <label for = "Action & Adventure">Action & Adventure</label>
					 <input type = "checkbox"
						 id = "category"
						 value = "Manga" />
					 <label for = "Manga">Manga</label>
					 <input type = "checkbox"
						 id = "category"
						 value = "Comedy" />
					 <label for = "Comedy">Comedy</label>
					 <input type = "checkbox"
						 id = "category"
						 value = "Drama" />
					 <label for = "Drama">Drama</label>
					 <input type = "checkbox"
						 id = "category"
						 value = "Romance" />
					 <label for = "Romance">Romance</label>
					 <input type = "checkbox"
						 id = "category"
						 value = "Horror & Thriller" />
					 <label for = "Horror & Thriller">Horror & Thriller</label>
				</div>
				<br />
				
				<input class ="button" type="submit" value="Next" id="next_first" />
				</form>
			</div> <!-- FIRST STEP --->
			<div id ="second_step"> <!-- Second STEP --->
				<form id="upload" method="post" action="upload-pages.php" enctype="multipart/form-data">
				<div id ="upload-input">
				<a>Browse</a>
				<input type="file" name="upl" multiple />
				</div>
			<div id="upload-items">
			<ul>
				<!-- The file uploads will be shown here -->
			</ul>
			</div>
			
		</form>	
			<form id="upload_2" method="post" action="upload-blocks.php">
				<input class ="button" type="submit" value="Next" id="next_second" />
				<input type="hidden" name="name" id="h_t" value="">
				<input type="hidden" name="synopsis" id="h_s" value="">
			</form>
			</div> <!-- Second STEP --->
			<div id ="third_step">  <!-- Third STEP -->
				
			</div> <!-- Third STEP -->
			<div id ="processing">  <!-- processing -->
				<label>loading...</label>
			</div> <!-- processing-->
			</div>
	
<section id="author-page-container">
	<span class="back"></span>
	<span class="front"></span>
	<ul class="tiles-slider">
	<li class="tile-slide">
	<h1 class="slide-header">Connections</h1>
	</li>
	<li class="tile-slide">
	<div id="maintiles">
		<div class="tile" id="new"><article><div></div><header><p>Recent Release</p></header></article></div>
		<div class="tile" id="bio"><article><?php
								   echo '<img src='.$_SESSION['UserThumb'].' class="user_thumb"></img>';
								
								?><aside><h1>Artist</h1><p>User details not available</p></aside></article></div>
		<div class="tile" id="connections"><article><section><h1>6 Connections</h1><p></p></section><div></div></article></div>
		<div class="tile" id="subscribers"><article><section><h1>121 Subscribers</h1><p></p></section><div>+</div></article></div>
		<div class="tile" id="blocks"><article><section><h1>No Comics</h1><div></div></section><header><p>Comics</p></header></article></div>
		<div class="tile" id="series"><article><section><h1>No Articles</h1><p>By User <?php echo $_SESSION['FirstName'] ." " .$_SESSION['LastName'] ?></p></section><header><p>Articles</p></header></article></div>
		<div class="tile" id="settings"><article><header><p>Settings</p></header></article></div>
		
	</div>
	</li>
	<li class="tile-slide">
	<h1 class="slide-header">Comics</h1>
	<div class="tile" id="blockspage">
		<div class = "myblocks-container">
				<ul class ="myblocks">
				<li><div class="addOverl"></div><img class="addBlocks" src ="../dir/common/user/images/thumb_empty.jpg" title="add"/><div class="editTag">Add New Blocks</div></li>
				</ul>		
		</div>

	</div>
	</li>
	<li class="tile-slide">
	<div  id="settings-tile">
	<h1 class="slide-header">Settings</h1>
	</h1>
	</div>
	</li>
	</ul>
</section>



			
			
	
<script type="text/javascript">
			$(function() {
				var $tiles_slider	= $('.tiles-slider');
				$tiles_slider.tilesSlider();
			});
        </script>		
</body>
</html>
